// 回到顶部
window.onscroll = function () {
    var tops = document.querySelector("#top");
    tops.onclick = function () {
        document.documentElement.scrollTop = 0;
    }
}

// 显示商品列表
/*
  接口地址：http://jx.xuzhixiang.top/ap/api/productlist.php
    接口请求方式：get
    接口参数：
    无需参数（不登录也能看到商品列表）
    uid 可选参数，可以看到当前用户上传到服务器的商品
    使用方式
    http://jx.xuzhixiang.top/ap/api/productlist.php
*/
goodsList();
//    var id=localStorage.getItem('id');
function goodsList() {
      var pagenum = 0;
      var pagesize = 36;
    var listUrl = ' http://jx.xuzhixiang.top/ap/api/productlist.php';
    axios.get(listUrl,
        { params: { uid: 121203 ,pagesize,pagenum} }).then(res => {
            var goodsArr = res.data.data;
            console.log(res);
            // console.log(goodsArr);
            // 获取商品前四个,显示推荐
            console.log(goodsArr);
            var goods = goodsArr.slice(0, 4);
            var goodsStr = '';
            goods.forEach(item => {
                goodsStr += `
                    <li>
                        <a href="./html/details.html?id=${item.pid}" target="_blank">
                            <img src="${item.pimg}" alt="">
                            <p>${item.pname}</p>
                            <span>￥${item.pprice}</span>
                        </a>     
                    </li>
                `
            });
            document.querySelector('.recommend ul').innerHTML = goodsStr;
            // 获取后面的商品，显示爱情表白
            var goodsLove = goodsArr.slice(4, 12);
            var goodsStrLo = '';
            goodsLove.forEach(item => {
                goodsStrLo += `
                    <li>
                         <a href="./html/details.html?id=${item.pid}" target="_blank">
                            <img src="${item.pimg}" alt="">
                            <p>${item.pname}</p>
                            <span>￥${item.pprice}</span>
                        </a>
                    </li>
                `
            });
            document.querySelector('.love ul').innerHTML = goodsStrLo;
            // 获取后面的商品，显示生日祝福
            var goodsBirthday = goodsArr.slice(12, 20);
            var goodsStrBir = '';
            goodsBirthday.forEach(item => {
                goodsStrBir += `
                    <li>
                         <a href="./html/details.html?id=${item.pid}" target="_blank">
                            <img src="${item.pimg}" alt="">
                            <p>${item.pname}</p>
                            <span>￥${item.pprice}</span>
                        </a>
                    </li>
                `
            });
            document.querySelector('.birthday ul').innerHTML = goodsStrBir;
            // 获取后面的商品，显示长辈
            var goodsElder = goodsArr.slice(20, 28);
            var goodsStrEl = '';
            goodsElder.forEach(item => {
                goodsStrEl += `
                    <li>
                         <a href="./html/details.html?id=${item.pid}" target="_blank">
                            <img src="${item.pimg}" alt="">
                            <p>${item.pname}</p>
                            <span>￥${item.pprice}</span>
                        </a>
                    </li>
                `
            });
            document.querySelector('.elder ul').innerHTML = goodsStrEl;
            // 获取后面的商品，显示商务
            var goodsBusiness = goodsArr.slice(28, 36);
            var goodsStrBus = '';
            goodsBusiness.forEach(item => {
                goodsStrBus += `
                    <li>
                         <a href="./html/details.html?id=${item.pid}" target="_blank">
                            <img src="${item.pimg}" alt="">
                            <p>${item.pname}</p>
                            <span>￥${item.pprice}</span>
                        </a>
                    </li>
                `
            });
            document.querySelector('.business ul').innerHTML = goodsStrBus;

        })
}